{include file="Public:header" /}
{include file="Public:nav" /}

		<div class="bar bar-nav">
			<h1 class="title">活动列表</h1>
			<i class="icon icon-left" onclick="window.history.go(-1);"></i>
		</div>
		
		<div class="content">
			<div class="search pad20">
				<div class="in_map">
					<i class="iconfont icon-map"></i><span id="city-picker">{$city}</span>
				</div>
				<form action="{:U('activityList')}" method="post" style="width:100%;">	
				<div class="in_search">
					<div class="searchbar">
						<a class="searchbar-cancel">取消</a>
						
						<div class="search-input">
							<label class="icon icon-search" for="search"></label>
							<input type="text" name="activity_name" id='search' placeholder='输入关键字...' />
						</div>
					</div>
				</div>
				</form>
			</div>

			<div class="buttons-tab screen" style="margin-top:10px;">
				<span class="tab-link button">
					<select name="category">
						<option value="">分类</option>
					 {foreach name="category" item="category" key="k"}
						<option {if condition="$category_id eq $category['id']"} selected {/if} value="{$category['id']}">{$category['name']}</option>
					 {/foreach}
					</select>
				</span>
				<span class="tab-link button">
					<select name="new_or_hot">
						<option value="">最新 / 最热</option>
						<option {if condition="$new_or_hot eq 'new'"} selected {/if} value="new">最新</option>
						<option {if condition="$new_or_hot eq 'hot'"} selected {/if} value="hot">最热</option>
					</select>
				</span>
				<span class="tab-link button">
					<select name="price">
						<option value="">费用</option>
						<option value="free">免费</option>
						<option value="charge">收费</option>
						<option {if condition="$price eq 'price_desc'"} selected {/if} value="price_desc">从高到低</option>
						<option {if condition="$price eq 'price_asc'"} selected {/if} value="price_asc">从低到高</option>
					</select>
				</span>
			</div>
			
			<div class="in_hot_box activity_1">
					{foreach name="activity" item="activity" key="k"}
					<div class="card demo-card-header-pic">
						<!-- <a href="{:U('activityDetail/index',array('activity_id'=>$activity['id'],'city'=>$city_select))}"> -->
						<a href="/activityDetail/index?activity_id={$activity['id']}&city={$city_select}">
						<div valign="bottom" class="card-header color-white no-border no-padding">
							<img class='card-cover' src="{$activity['activity_img']}" alt="">
						</div>
						<div class="card-content">
							<div class="card-content-inner">
								<p class="hot_list_title">{$activity['activity_name']}</p>
								<p class="color-gray">{$activity['start_time']|date="Y-m-d",###} 至 {$activity['end_time']|date="Y-m-d",###}</p>
								<p class="color-gray"><span>{$activity['area']}</span><span>{$activity['signup_number']|default="0"}人已报名</span><span>￥{$activity['price']}</span></p>
							</div>
						</div>
						</a>
					</div>
					{/foreach}
			</div>
			
			<div class="infinite-scroll-preloader" style="display:none;">
				<div class="preloader"></div>
			</div>
			{if condition="$activity_show"}
			<p onclick="ajax_sourch_submit();" id="load_more"><span class="icon icon-down"></span> 点击加载更多...</p>
			{else/}
			<p id="load_more"> 暂无数据！</p>
			{/if}
			
		</div>



{include file="Public:category_city_box" /}	
<script type="text/javascript" src="http://g.alicdn.com/sj/lib/jquery/dist/jquery.min.js"></script>
<script type='text/javascript' src='http://g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
<script type='text/javascript' src='http://g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
<script src="http://idangero.us/swiper/dist/js/swiper.min.js"></script>
	
<script>
	$("select[name='category']").change(function(){
		var v = $(this).val();
		window.location.href = "/ActivityCategory/activityList/category/"+v;
	});
	
	$("select[name='new_or_hot']").change(function(){
		var v = $(this).val();
		var category = "{$category_id}" ? "/category/{$category_id}" : "" ;
		var price = "{$price}" ? "/price/{$price}" : "" ;
		window.location.href = "/ActivityCategory/activityList"+category+"/new_or_hot/"+v+price;
	});
	
	$("select[name='price']").change(function(){
		var v = $(this).val();
		var category = "{$category_id}" ? "/category/{$category_id}" : "" ;
		var new_or_hot = "{$new_or_hot}" ? "/new_or_hot/{$new_or_hot}" : "";
		window.location.href = "/ActivityCategory/activityList"+category+new_or_hot+"/price/"+v;
	});
	
	//首页城市选择
	$(".letter a").click(function() {
		var s = $(this).html();
		window.location.href = '#' + s + '1';
		$("#showLetter span").html(s);
		$("#showLetter").show().delay(500).hide(0);
	});
	//中间的标记显示
	$('body').on('onMouse', '.showLetter span', function() {
		$("#showLetter").show().delay(500).hide(0);
	});
	$(".in_map,.city_box .close").click(function() {
		$(".city_box").slideToggle();
	})
	$(".city-list p").click(function() {
		$(".city_box").fadeOut();
		$(".in_map span").html($(this).html())
		window.location.href = '/ActivityCategory/activityList?city='+$(this).html();
		console.log($(this).html())
	})
	
 var  page = 1;

 /*** ajax 提交表单 查询订单列表结果*/  
 function ajax_sourch_submit(){	 	 	 
	 	var city_select = "{$city}" ? "/city/{$city_select}" : "";
	    //var activity_name = "{$activity_name}" ? "/activity_name/{$activity_name}" : "";
	    var category_id = "{$category_id}" ? "/category/{$category_id}" : "";
	    var new_or_hot = "{$new_or_hot}" ? "/new_or_hot/{$new_or_hot}" : "";
	    var price = "{$price}" ? "/price/{$price}" : "";
	 	$(".infinite-scroll-preloader").show();
        page += 1;
		$.ajax({
			type : "GET",
			//url:"/index.php?m=Mobile&c=User&a=collect_list&is_ajax=1&p="+page,//+tab,			
			url:"/ActivityCategory/activityList/is_ajax/1/p/"+page+city_select+category_id+new_or_hot+price,//+tab,
//			data : $('#filter_form').serialize(),// 你的formid 搜索表单 序列化提交
			success: function(data)
			{
				$(".infinite-scroll-preloader").hide();
				if($.trim(data) == ''){
					$('#load_more').hide();
				}else{
				    $(".activity_1").append(data);
				}
			}
		}); 
 } 
</script>